<!DOCTYPE html>
<!--使用thymleaf必须加这个-->
<!--Thymeleaf是一个现代服务器端Java模板引擎，适用于Web和独立环境，能够处理HTML，XML，JavaScript，CSS甚至纯文本。-->
<html class="loginHtml" lang="cn" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8">
	<title>用户登录</title>
	<!--网页的图标-->
	<link rel="shortcut icon" href="../img/cqutLog.jpg" th:href="@{/img/cqutLog.jpg}" type="image/x-icon">
 	<!--链接表达式-->
	<link rel="stylesheet" href="../layui/css/layui.css" th:href="@{/layui/css/layui.css}" media="all"/>
	<link rel="stylesheet" href="../css/public.css" th:href="@{/css/public.css}" media="all"/>
	<link rel="stylesheet" href="../css/bootstrap.min.css" th:href="@{/css/bootstrap.min.css}">
	<style>
		.layui-form-switch {
			position: relative;
			height: 20px;
			min-width: 35px;
			margin-top: 0px;
			margin-left: 10px;
		}
		.layui-form-switch i{
			top: 2px;
			width: 14px;
			height: 14px;
		}
		.layui-form-switch em{
			top: -4px;
		}
	</style>
</head>
<body class="loginBody">
	<!-- 表单 -->
	<form class="layui-form" >
		<!--头像-->
		<div class="login_face"><img src="../img/cqutLog.jpg" th:src="@{/img/cqutLog.jpg}"  class="userAvatar" style="width: 100%;height: 100%"></div>
		<div class="layui-form-item input-item">
			<label for="userName">用户名</label>
			<input type="text" placeholder="请输入用户名" autocomplete="on" id="username" name="username" class="layui-input" required lay-verify="title">
		</div>
		<div class="layui-form-item input-item">
			<label for="password">密码</label>
			<input type="password" placeholder="请输入密码" value="123456abc" autocomplete="on" id="password" name="password"   class="layui-input" required lay-verify="pass">
		</div>
		<div class="layui-form-item input-item" id="imgCode">
			<label for="code">验证码</label>
			<input type="text" placeholder="请输入验证码" autocomplete="off" id="code" name="code"  class="layui-input">
			<img src="home/getCode" th:src="@{/login/getCode}" onclick="changeCode()" id="codeImg">

		</div>
		<div class="layui-form-item">
			<button  class="layui-btn" lay-submit="" lay-filter="login" style="width:45%;">登录</button>
			<button type="button" class="layui-btn" id="register" style="width: 45%;float: right;" >注册</button>
		</div>
		<div class="layui-form-item" style="position: relative;line-height: 24px;height: 24px;">
			<span style="height: 24px;float: left;">记住密码</span>
			<input type="checkbox" value="0" id="check" lay-skin="switch" lay-text="是|否" >
			<a id="pwdReturn" style="float: right;height: 24px;cursor: pointer;">忘记密码</a>
		</div>
	</form>
	<!-- 页脚 -->
    <style>
        .bottom {
            font-size: 12px;
        }

        .bottom .row ul {
            list-style: none;
            line-height: 20px;
        }

        .bottom .row ul li {
            float: left;
        }

        .bottom .row a img {
            width: 16px;
            height: 16px;
            vertical-align: middle;
            margin-top: -4px;
        }

        .bottom .row a {
            vertical-align: middle;
            line-height: 20px;
            margin: 0;
            padding: 2px 6px;
            cursor: pointer;
        }

        .bottom .row a span {
            line-height: 20px;
        }
    </style>
	<div class="fixed-bottom" style="width: 100%;background-color: whitesmoke;opacity: 0.7;">
		<div class="container bottom">
				<div class="row">
					<div class="col-3"></div>
					<div class="col-7 clearfix">
						<ul>
							<li><a class="nav-link text-secondary" href="#">关于我们</a></li>
							<li><a class="nav-link text-secondary" href="#">招贤纳士</a></li>
							<li><a class="nav-link text-secondary" href="#">广告服务</a></li>
							<li><a class="nav-link text-secondary" href="#"><img src="../img/tel.png"
									th:src="@{/img/tel.png}"	alt="#"><span>800-820-8820</span> </a></li>
							<li><a class="nav-link text-secondary" href="#"><img src="../img/email.png"
									th:src="@{/img/email.png}"	alt=""><span>2528427717@qq.com</span> </a></li>
							<li><a class="nav-link text-secondary" href="#"><img src="../img/kf.png"
									 th:src="@{/img/kf.png}" 	 alt=""><span>在线客服</span></a></li>
						</ul>
					</div>
					<div class="col-2"></div>
				</div>
				<div class="row">
					<div class="col-1"></div>
					<div class="col-10 clearfix">
						<ul>
							<li><a class="nav-link text-secondary" href="#"><img src="../img/ga.png"
									th:src="@{/img/ga.png}"	alt="#"><span>公安备案号11010502030143</span></a></li>
							<li><a class="nav-link text-secondary" href="#">ICP备19004658号</a></li>
							<li><a class="nav-link text-secondary" href="#">经营性网站备案信息</a></li>
							<li><a class="nav-link text-secondary" href="#">互联网违法和不良举报中心</a></li>
							<li><a class="nav-link text-secondary" href="#">网络110报警服务</a></li>
							<li><a class="nav-link text-secondary" href="#">©2021重庆理工大学11703060219</a></li>
						</ul>
					</div>
					<div class="col-1"></div>
				</div>
				<div class="row">
					<div class="col-5"></div>
					<div class="col-2">
						<ul>
							<li><a class="nav-link text-secondary" href="#">版权与免责声明</a></li>
							<li><a class="nav-link text-secondary" href="#">版权申诉</a></li>
						</ul>
					</div>
					<div class="col-5"></div>
				</div>
			</div>
	</div>
   
	<script type="text/javascript" src="../layui/layui.js" th:src="@{/layui/layui.js}" ></script>
	<script type="text/javascript" src="../js/login.js" th:src="@{/js/login.js}"></script>
</body>
</html>